﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图书馆大数据分析展示系统宣传册</title>
<meta name="viewport" content="width = 1050, user-scalable = no" />
<link rel="stylesheet" href="css/animate.min.css"/>
<script type="text/javascript" src="js/jquery.min.1.7.js"></script>
<script type="text/javascript" src="js/modernizr.2.5.3.min.js"></script>
</head>
<body>
<div id="txt_flag" style="width: 200px;text-align: center;margin:50px auto 0;font-size:16px;font-family:'微软雅黑';font-weight: 700; color:#A4A5A5;">点击书角即可翻页查看</div>
<div class="flipbook-viewport">
	<div class="container">
		<div class="flipbook">
			<div style="background-image:url(pages/first.png);background-repeat: round;"></div>
			<div style="background-image:url(pages/1.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/2.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/3.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/4.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/5.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/6.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/7.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/8.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/9.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/10.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/11.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/12.jpg);background-repeat: round;"></div>
			<div style="background-image:url(pages/last.png);background-repeat: round;"></div>
		</div>
	</div>
</div>
<script type="text/javascript">
	function loadApp() {
	// Create the flipbook
	$('.flipbook').turn({
			// Width
			width:1000,
			// Height
			height:700,
			// Elevation
			elevation: 50,
			// Enable gradients
			gradients: true,
			// Auto center this flipbook
			autoCenter: true

	});
}
	// Load the HTML4 version if there's not CSS transform
	yepnope({
	test : Modernizr.csstransforms,
	yep: ['js/turn.js'],
	nope: ['js/turn.html4.min.js'],
	both: ['css/basic.css'],
	complete: loadApp
});
	var famous_timer=null;
	function famous_move(){
		//console.log('执行');
		clearTimeout(famous_timer);
		$('#txt_flag').addClass('animated flash');
		$('#txt_flag').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
			$('#txt_flag').removeClass('animated flash');
		});
		famous_timer=setTimeout('famous_move()',3000);
	}
	setTimeout(function(){
		famous_move();
	},5000);




</script>

</body>
</html>